<template>	
	<el-table
	  :data="tableData"
	  style="width: 100%"
	  stripe
	  ref="multipleTable"
	   @selection-change="handleSelectionChange"
	   :header-cell-style="{background:'#eef1f6',color:'#606266'}"
	>
		<el-table-column min-width="15%" type="selection"></el-table-column>
		<el-table-column prop="id" label="编号" sortable  width="100" />
		<el-table-column prop="description" label="活动名称" sortable />
		<el-table-column prop="participantsNum" label="参与人数" sortable />
		<el-table-column prop="startTime" label="开始时间" sortable />
		<el-table-column prop="endTime" label="结束时间" sortable />
		<el-table-column prop="teacher.name" label="发起人"/>
		<el-table-column prop="leader.name" label="审批人"/>
		<el-table-column prop="state" label="活动状态" :formatter="formatProtocolType"/>
		<el-table-column prop="signedNum" label="签到人数"/>
		<el-table-column label="操作" width="150"> 
		<template #default="scope">
					<el-button size="small" @click="editSubmit(scope.row.id)"
										type="success" squire>通过</el-button>
										
										<el-popconfirm title="确定要打回吗?" @confirm="handleDelete(scope.row.id)">
										    <template #reference>
											  <el-button  size="small"
											  	type="danger"
											  	@click=""
											  	 squire>拒绝</el-button>
										    </template>
										</el-popconfirm>
										</template>
		</el-table-column>
	</el-table>    	
</template>
<script setup>
	import {ref,toRefs,reactive,onMounted,getCurrentInstance} from 'vue'
	import{ useRouter } from 'vue-router'
	let { proxy } = getCurrentInstance();
	// import TEditor from '../components/TEditor.vue'
	var tableData=ref([]);

	function getTableData(){
	    proxy.$http.get("/FindAllToApproval?id="+ window.sessionStorage.getItem('userId'),
		{"headers":{"token":window.sessionStorage.getItem("token")}})
		.then(res => {
			tableData.value=res.data.data;//把获取的服务端数据数组传递给tableData
		})
		.catch(err => {
			console.log(err)
		});
	}
	onMounted(()=>{
		getTableData();  //请求第一页的表格数据
		// proxy.$http.get("/FindAllToApproval?id="+ window.sessionStorage.getItem('userId'),
		// {"headers":{"token":window.sessionStorage.getItem("token")}})
		// .then(res => {
		// 	teacherOption.value=res.data.data;//获取学院下拉数据，仅仅id和名称
		// })
	});
	
	function handleChange (item) {
		console.log('change', item)
	}

	let form=ref({});//修改或增加的一个对象
	 
	const editSubmit = (id) => {
		 //要修改的对象赋值给对话框表单数据
		proxy.$http.get("/Approval?id="+ id,
		{"headers":{"token":window.sessionStorage.getItem("token")}})
		.then(res => {
			//studentOption.value=res.data.data;//获取学院下拉数据，仅仅id和名称
			getTableData();  
			alert(res.data.message)
		})
	}

	const handleDelete = (id) => {
		proxy.$http.get('/NotApproval'+"?id="+id,
		{"headers":{"token":window.sessionStorage.getItem("token")}})//根据接口组织删除用url：/school/deleteById/{id}
		.then(res => {			
			getTableData();  //更新表格数据
			alert(res.data.message)
		})
	}
	
	
	function  formatProtocolType(row) {
	  　　let type = row.state;
	 　　switch (type) {
	  　　　　case 1:
	  　　　　　　type = "通过";
	  　　　　　　break;
	  　　　　case 0:
	  　　　　　　type = "待审核";
	 　　　　　　break;
	 　　　　case 2:
	 　type = "未通过";
	break;
	 　　}
	 
	 　　return type;
	 
	 }

	</script>